<template>
  <a-row style="height: 100%;">
    <a-col :md="8" :lg="7" :xl="6" :xxl="4"  style="height: 100%;">
      <a-card  title="医嘱列表" style="margin-right: 12px;height: 100%;">
        <a-button type="primary" slot="extra">新增医嘱</a-button>
        <div
          class="g-flex g-y-center g-x-between"
          v-for="(item,index) in templateList"
          :class="['template-item',{'currentTemplatelass':currentTemplateIndex===index}]"
          :key="item.id"
          @click="clickTemplateItem(item.id,index)">
          <span>{{index+1}}.</span>
          <div style="width: 150px;;" class="g-no-wrap-hidden">{{item.templateName}}</div>
          <a-switch checked-children="开" un-checked-children="关" @change.stop="e =>changeSwitch(e,record,index)" :checked="numberToBoolean(item.isDisabled)" />
        </div>
      </a-card>
    </a-col>
    <a-col :md="16" :lg="17" :xl="18" :xxl="20" style="height: 100%;">
      <a-card :title="currentTemplate?currentTemplate.templateName:''" style="height: 100%;">
        <super-table
          ref="table"
          :columns="columns"
          :data="loadData"
          :rowKey="(record,index)=> index"
          :scroll="{ x: 800}"
        >
          <template slot="action" slot-scope="text,record">
            <a-popconfirm title="确定删除吗?" @confirm="() =>clickDelete(record)">
              <a-button class="g-bt-pad-0" type="link" >删除</a-button>
            </a-popconfirm>
            <a-button class="g-bt-pad-0" type="link" >编辑</a-button>
          </template>
        </super-table>

      </a-card>
    </a-col>
  </a-row>
</template>

<script>

import { AdviceTemplateList, AdviceTemplateDetails, deleteCommonlyPrescribed } from '@/api/bd/doctorEnjoin'

import addForm from './addForm'
import editForm from './editForm'
import detailsDrawer from '@/views/baseData/organizationFramework/role/detailsDrawer'
import { SuperTable } from '@/components'
export default {
    components: {
      SuperTable,
      addForm,
      editForm,
      detailsDrawer
    },

    data () {
      return {
        loadData: parameter => {
          if(!this.currentTemplate) return new Promise((resolve => resolve(null)))
          return AdviceTemplateDetails(Object.assign(this.queryParam,parameter)).then(res => {
            console.log('模板明细',this.queryParam,res)
            return res
          })
        },
        // 查询参数
        queryParam: {id:''},
        templateList:[],
        currentTemplateIndex:0,
        currentTemplate:null,
        // 表头
        columns: [
          { title: '序号', customRender:(text,record,index)=> (this.queryParam.pageNum - 1) * this.queryParam.pageSize + (index + 1),width:50 },
          { title: '组号', dataIndex: 'groupId',scopedSlots: { customRender: 'groupId' } ,width: 80, ellipsis: true },
          { title: '临/嘱', dataIndex: 'ftype',scopedSlots: { customRender: 'ftype' } ,width: 90,ellipsis: true},
          { title: '医嘱', dataIndex: 'itemName', width: 100,ellipsis: true },
          { title: '规格', dataIndex: 'spec',width: 115, ellipsis: true },
          { title: '下达日期', dataIndex: 'startDate', width: 115, ellipsis: true },
          { title: '首次用量', dataIndex: 'firstDosage',scopedSlots: { customRender: 'firstDosage' } , width: 90,ellipsis: true },
          { title: '每次用量', dataIndex: 'dosage',scopedSlots: { customRender: 'dosage' } , width: 90, ellipsis: true },
          { title: '金额', dataIndex: 'price', width: 130,scopedSlots: { customRender: 'price' } , ellipsis: true },
          { title: '用量/单位', dataIndex: 'unit', width: 100, ellipsis: true },
          { title: '用药/频率', dataIndex: 'useTimes',scopedSlots: { customRender: 'useTimes' } , width: 145, ellipsis: true },
          { title: '用药途径', dataIndex: 'useWays',scopedSlots: { customRender: 'useWays' } , width: 135, ellipsis: true },
          { title: '操作',scopedSlots: { customRender: 'action' } , width: 110, fixed:'right'},
        ]
      }
    },

    created () {
      this.getAdviceTemplateList()
    },

    methods: {
      getAdviceTemplateList(){
        AdviceTemplateList().then(res=>{
          console.log('模板列表',res)
          this.templateList = res.rows
          if(this.templateList.length>0){
            this.currentTemplate = this.templateList[0]
            this.queryParam.id = this.templateList[0].id
            this.$refs.table.refresh(true)
          }
        })
      },
      /**
       * 点击模板名称
       * **/
      clickTemplateItem(id,index){
        if(this.currentTemplateIndex==index) return
        this.currentTemplateIndex = index ||0
        this.currentTemplate = this.templateList[index]
        this.queryParam.id = id
        this.$refs.table.refresh(true)
      },
      numberToBoolean(text){
        return typeof (text) =='boolean' ? text :(text == 0 ? false : true)
      },
      /**
       * 修改用户状态
       */
      changeSwitch(value,record,index){
        console.log('record',record)
        console.log('status',value)
        this.templateList[index].status = value
      },
      /**
       * 删除
       */
      clickDelete(record){
        console.log(record)
        deleteCommonlyPrescribed({id:record.id}).then(res=>{
          console.log('删除结果',res)
          if(res.code==200){
            this.$message.success(res.message)
            this.$refs.table.refresh(true)
          }else{
            this.$message.warning(res.message)
          }
        })
      }
    }
  }
</script>

<style lang="less">
  .table-operator {
    margin-bottom: 18px;
  }
  button {
    margin-right: 8px;
  }
  .template-item{
    text-align: center;
    margin-top: 10px;
    cursor: pointer;
  }
  .currentTemplatelass{
    color: #3399ff;
  }

</style>
